<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>myboke</title>
    <link rel="stylesheet" href="css/index.css" type="text/css">
     <script src="jquery-1.8.3.min.js"></script>
     <script>
            $(function(){
            $(".m-btn").toggle(function(){
                    $(".g-side").animate({left: '-250px'}, 1000);
                    $(".g-main").animate({marginLeft:'0'}, 1000);
                    $(".m-btn").animate({marginLeft:'0',opacity:'1'}, 1000);
                
                },function(){

                    $(".g-side").animate({left: '0'}, 1000);
                    $(".g-main").animate({marginLeft:'250'}, 1000);
                    $(".m-btn").animate({marginLeft:'250', opacity:'0.5'}, 1000);

                    })

            })
    </script>
 </head>
<body>
    <div class="g-warp">
        <div class="g-sidebar">
             <div class="m-btn">
             
            </div>
            <div class="g-side">
                <a href="#" class="m-logo"></a>
                <div class="m-nav">
                    <a class="crt" href="#">首页</a>
                    <a href="#">关于我</a>
                </div>
                <div class="m-search">
                    <input type="text" name="search" value="search">
                    <span></span>
                </div>
                <div class="m-list">
                    <h1 class="title"><i></i><span> 近期文章</span></h1>
                    <ul>
                        <li> <a href="#">拟物化设计VS扁平化设计</a></li>
                        <li> <a href="#">前端开发</a></li>
                        <li> <a href="#">视觉设计</a></li>
                    </ul>
                </div>
        
                <div class="m-list">
                    <h1 class="title"><i></i><span> 热门标签</span></h1>
                    <div class="sign">
                        <a href="" class="hot">CSS</a> <a href="" class="hot">CSS3</a>
                        <a href="" class="hot">javascript</a> <a href="" class="hot">mvc-js</a> 
                        <a href="" class="hot">视觉设计</a> 
                    </div>
                </div> 
                <div class="clear-fl">
                    
                </div>  
                <div class="m-list">
                    <h1 class="title"><i></i><span> 友情链接</span></h1>
                    <ul>
                        <li> <a href="#">Web前端开发</a></li>
                        <li> <a href="#">一淘UED</a></li>
                        <li> <a href="#">试客联盟</a></li>
                        <li> <a href="#">UED China</a></li>
                    </ul>
                </div>
                <div class="m-list">
                    <h1 class="title"><i></i><span> 联系我</span></h1>
                    <ul>
                        <li> <a href="#">QQ：3082237853</a></li>
                    </ul>
                </div>
             
            </div>
           
        </div>
        

        
        <div class="g-main">
            <div class="m-nav-r">
                <a href="">生活</a>
                <a href="">前端开发</a>
                <a class="z-crt" href="">视觉设计</a>
                <a href="">网页重构</a>
            </div>
            <div class="m-main">
                <div class="m-ct"> 
                    <div class="m-title">  
                        <a class="img"></a> 
                        <div class="title"> 
                            <h2 class="tit">
                                 <a href=""> 从水粉色彩理论到网页设计</a>
                                 <span> <a href="" class="sig">4</a></span> 
                            </h2>
                            <p class="info">
                                <span class="author">qiu</span> -
                                <span class="cats"><a href="">视觉设计</a></span> |
                                <span class="time">2013-04-02 </span>
                            </p>
                        </div>

                    </div>         
                    <p class="con">配色相信是一个网站的致胜关键元素之一。关于学习配色，你是从什么时候开始？ </p>
                    <div class="reader">
                        <span class="view">浏览[695]</span>
                         <span class="view">评论[23]</span>
                         <span class="good"><i></i>赞[23]</span>
                         <span class="readmore"><a href="">阅读全文 </a></span>
                    </div>
                </div>
                
                <div class="m-ct"> 
                    <div class="m-title">  
                        <a class="img"></a> 
                        <div class="title"> 
                            <h2 class="tit">
                                 <a href=""> 从水粉色彩理论到网页设计</a>
                                 <span> <a href="" class="sig">4</a></span> 
                            </h2>
                            <p class="info">
                                <span class="author">qiu</span> -
                                <span class="cats"><a href="">视觉设计</a></span> |
                                <span class="time">2013-04-02 </span>
                            </p>
                        </div>
                        
                    </div>         
                    <p class="con">配色相信是一个网站的致胜关键元素之一。关于学习配色，你是从什么时候开始？ </p>
                    <div class="reader">
                        <span class="view">浏览[695]</span>
                         <span class="view">评论[23]</span>
                         <span class="good"><i></i>赞[23]</span>
                         <span class="readmore"><a href="">阅读全文 </a></span>
                    </div>
                </div>
                
                <div class="m-ct"> 
                    <div class="m-title">  
                        <a class="img"></a> 
                        <div class="title"> 
                            <h2 class="tit">
                                 <a href=""> 从水粉色彩理论到网页设计</a>
                                 <span> <a href="" class="sig">4</a></span> 
                            </h2>
                            <p class="info">
                                <span class="author">qiu</span> -
                                <span class="cats"><a href="">视觉设计</a></span> |
                                <span class="time">2013-04-02 </span>
                            </p>
                        </div>
                        
                    </div>         
                    <p class="con">配色相信是一个网站的致胜关键元素之一。关于学习配色，你是从什么时候开始？ </p>
                    <div class="reader">
                        <span class="view">浏览[695]</span>
                         <span class="view">评论[23]</span>
                         <span class="good"><i></i>赞[23]</span>
                         <span class="readmore"><a href="">阅读全文 </a></span>
                    </div>
                </div>
                
                <div class="m-ct"> 
                    <div class="m-title">  
                        <a class="img"></a> 
                        <div class="title"> 
                            <h2 class="tit">
                                 <a href=""> 从水粉色彩理论到网页设计</a>
                                 <span> <a href="" class="sig">4</a></span> 
                            </h2>
                            <p class="info">
                                <span class="author">qiu</span> -
                                <span class="cats"><a href="">视觉设计</a></span> |
                                <span class="time">2013-04-02 </span>
                            </p>
                        </div>
                        
                    </div>         
                    <p class="con">配色相信是一个网站的致胜关键元素之一。关于学习配色，你是从什么时候开始？ </p>
                    <div class="reader">
                        <span class="view">浏览[695]</span>
                         <span class="view">评论[23]</span>
                         <span class="good"><i></i>赞[23]</span>
                         <span class="readmore"><a href="">阅读全文 </a></span>
                    </div>
                </div>
                    
                <div class="m-ct"> 
                    <div class="m-title">  
                        <a class="img"></a> 
                        <div class="title"> 
                            <h2 class="tit">
                                 <a href=""> 从水粉色彩理论到网页设计</a>
                                 <span> <a href="" class="sig">4</a></span> 
                            </h2>
                            <p class="info">
                                <span class="author">qiu</span> -
                                <span class="cats"><a href="">视觉设计</a></span> |
                                <span class="time">2013-04-02 </span>
                            </p>
                        </div>
                        
                    </div>         
                    <p class="con">配色相信是一个网站的致胜关键元素之一。关于学习配色，你是从什么时候开始？ </p>
                    <div class="reader">
                        <span class="view">浏览[695]</span>
                         <span class="view">评论[23]</span>
                         <span class="good"><i></i>赞[23]</span>
                         <span class="readmore"><a href="">阅读全文 </a></span>
                    </div>
                </div>
                <div class="page">
                    <a href="">首页</a> 
                    <a href="" class="cur">1</a>   
                    <a href="">2</a>   
                    <a href="">3</a>
                    <a href="">下一页</a>
                    <a href="">尾页</a>
                </div>
            </div>
            <div class="footer">
             <p>shikeeUED Team © 2011.All rights Reserved. Powered By WordPress.&nbsp;&nbsp;<a href="">站长统计</a></p>
             
            </div>
        </div> 
        <a class="b-top" href=""></a>
    </div>
   
</body>
</html>